<template>
    <div class="dailySeckillList">
        <template v-for="(item,index) in $store.state.dailySeckillList">
            <div class="dailySeckillList-product">
                <div class="dailySeckillList-product-img" @click="torouteFn"><img :src="item.imgUrl"></div>
                <p class="dailySeckillList-product-price" @click="torouteFn"><van-tag round type="primary" color="#fbe7e3" class="van-primary van-ellipsis">{{item.price}}</van-tag></p>
            </div>
        </template>
      
    </div>
</template>
<script>
export default {
    methods: {
        // 编程式路由
        torouteFn(){
            this.$router.push({path:"/seckill/seckilllist"}).catch(err=>{})
        }
    },
}
</script>
<style lang="less" scoped>
    .dailySeckillList{
        width: 670px;
        margin: 0 auto;
        margin-top: 15px;
        display: flex;
        justify-content: space-between;
        .dailySeckillList-product-img{
            width: 153px;
            height: 153px;
            border: dotted 1px #000;
            img{
                width: 100%;
                height: 100%;
            }
        }
        .dailySeckillList-product-price{
            width: 153px;
            text-align: center;
            margin-top: 10px;
            padding-bottom: 18px;
            .van-primary{
                color: #ec4038;
                width: 115px;
                position: relative;
                padding-left: 30px;
            }
            .van-primary::after{
                content: "";
                width: 18px;
                height: 18px;
                background-color: #ec4038;
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 12px;
                border-radius: 18px;
            }

        }
    }
</style>